<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>道路技术状况评估结果表</title>
    <link rel="icon" href="../../img/icon.png">
    <link href="../../CSS/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="../../layui/css/layui.css">
    <link href="../../font-awesome/css/font-awesome.css" rel="stylesheet">
    <link href="../../CSS/animate.css" rel="stylesheet">
    <link href="../../CSS/style.css" rel="stylesheet">
    <script src="../../JS/jquery-2.1.1.js"></script>
    <script src="../../JS/bootstrap.min.js"></script>
    <script src="../../JS/plugins/metisMenu/jquery.metisMenu.js"></script>
    <script src="../../JS/plugins/slimscroll/jquery.slimscroll.min.js"></script>
    <script src="../../JS/inspinia.js"></script>
    <script src="../../JS/plugins/pace/pace.min.js"></script>
    <script src="../../layui/layui.js"></script>
    <script>
      $(function () {
          var login=sessionStorage.getItem('Islogin');
          if(login!=1){
              if(confirm("未登陆,请先登陆")){
                  window.location.href='../../login.html';
              }
          }else {
              var obj = {
                  url: "http://localhost:8080/roadBasic/findAll",
                  type: "post",
                  dataType: "json",
                  async: true,
                  success: function (result) {
                      // var data=JSON.stringify(result[i]);
                      showData(result);
                  }
                  // error:function (e) {
                  //     alert("请求失败"+e.toString())
                  // }
              };
              $.ajax(obj);
              var obj1 = {
                  url: "http://localhost:8080/roadway/findAll",
                  type: "post",
                  dataType: "json",
                  async: true,
                  success: function (result) {
                      // var data=JSON.stringify(result[i]);
                      showData2(result);
                  }
                  // error:function (e) {
                  //     alert("请求失败"+e.toString())
                  // }
              };
              $.ajax(obj1);
          }
        })
        function  showData(result) {
            for(var i in result){
                var str="<option value='"+result[i].road_basic_name+"'>"+result[i].road_basic_name+"</option>";
                $("#road_basic_name").append(str);
            }
        }
        function  showData2(result) {
            for(var i in result){
                var str="<option value='"+result[i].roadway_id+"'>"+result[i].roadway_id+"</option>";
                $("#roadway_id").append(str);
            }
        }
    </script>
</head>

<body>
    <div id="wrapper">
        <!--左边菜单栏-->
        <nav class="navbar-default navbar-static-side" role="navigation">
            <div class="sidebar-collapse">
                <ul class="nav metismenu" id="side-menu">
                    <li class="nav-header">
                        <div class="dropdown profile-element">
                            <span>
                                <img alt="image" width="50px" height="50px" class="img-circle"
                                    src="../../img/head.jpg" />
                            </span>
                            <a data-toggle="dropdown" class="dropdown-toggle">
                                <span class="clear"><span class="block m-t-xs"><strong class="font-bold">组长:张宁</strong>
                                    </span><span class="text-muted text-xs block">组员<b class="caret"></b></span></span>
                            </a>
                            <ul style="text-align: center" class="dropdown-menu animated fadeInRight m-t-xs">
                                <li>王秋红</li>
                                <li>周彦西</li>
                                <li>王嘉伟</li>
                                <!--<li class="divider"></li>-->
                            </ul>
                        </div>
                        <div class="logo-element">
                            IN+
                        </div>
                    </li>
                    <li>
                        <a> <i class="fa fa-th-large"></i> <span class="nav-label">职工信息管理</span> <span class="fa arrow"></span></a>
                        <ul class="nav nav-second-level collapse">
                            <li><a href="../employee/employee.html"> 职工表</a></li>
                            <li><a href="../employeeType/employeeType.html">职工种类</a></li>
                        </ul>
                    </li>
                    <li>
                        <a> <i class="fa fa-th-large"></i> </i> <span class="nav-label">道路信息管理</span><span class="fa arrow"></span></a>
                        <ul class="nav nav-second-level collapse">
                            <li><a href="../roadBasic/roadBasic.html">道路基本信息表</a></li>
                            <li><a href="../roadwayType/roadwayType.html">车行道分类表</a></li>
                            <li><a href="../roadway/roadway.html">车行道信息表</a></li>
                            <li><a href="../roadType/roadType.html">路面类型表</a></li>
                            <li><a href="../ancillaryFacilities/ancillaryFacilities.html">附属设施表</a></li>
                        </ul>
                    </li>
                    <li>
                        <a> <i class="fa fa-th-large"></i><span class="nav-label">损害类型信息管理</span><span class="fa arrow"></span></a>
                        <ul class="nav nav-second-level collapse">
                            <li><a href="../damageTypeS/damageTypeStable.html">损害类型子参照表</a></li>
                            <li><a href="../damageTypeF/damageTypeFtable.html">损害类型父参照表</a></li>
                        </ul>
                    </li>
                    <li>
                        <a> <i class="fa fa-th-large"></i> <span class="nav-label">评定等级信息管理</span><span class="fa arrow"></span></a>
                        <ul class="nav nav-second-level collapse">
                            <li><a href="../evaluateGrade/evaluateGrade.html">评定等级表</a></li>
                            <li><a href="../ratingJudge/ratingJudge.html">评定等级判断表</a></li>
                            <li><a href="../evaluateIndex/evaluateIndex.html">评定指标表</a></li>
                            <li><a href="../damageSingle/damageSingle.html">路面损害单项扣分表</a><li>
                        </ul>
                    </li>
                    <li>
                        <a> <i class="fa fa-th-large"></i> <span class="nav-label">日常巡查信息管理</span><span class="fa arrow"></span></a>
                        <ul class="nav nav-second-level collapse">
                            <li><a href="../roadPatrol/roadPatrol.html">道路日常巡查记录表</a></li>
                            <li><a href="../damageSingle/damageSingle.html">设施损坏通知单</a><li>
                        </ul>
                    </li>
                    <li>
                        <a> <i class="fa fa-th-large"></i> <span class="nav-label">定期检查信息管理</span><span class="fa arrow"></span></a>
                        <ul class="nav nav-second-level collapse">
                            <li><a href="../pavementFlatness/pavementFlatness.html">平整度检测记录表</a></li>
                            <li><a href="../roadDamage/raodDamage.html">路面损害情况记录表</a><li>
                            <li><a href="../pavementDamage/pavementDamage.html">路面损害调查表</a><li></li>
                            <li><a href="../roadTechnicalEvaluate/roadTechnicalEvaluate.html">道路技术状况评估结果表</a></li>
                        </ul>
                    </li>
                </ul>
            </div>
        </nav>

        <!--右边界面框-->
        <div id="page-wrapper" class="gray-bg">
            <!--head-->
            <div class="row border-bottom">
                <nav class="navbar navbar-static-top" role="navigation" style="margin-bottom: 0">
                    <div class="navbar-header">
                        <a class="navbar-minimalize minimalize-styl-2 btn btn-primary " href="#"><i
                                class="fa fa-bars"></i></a>
                        <form role="search" class="navbar-form-custom" action="#">
                            <div class="form-group">
                                <input type="text" placeholder="Search for something..." class="form-control"
                                    name="top-search" id="top-search">
                            </div>
                        </form>
                    </div>
                    <ul class="nav navbar-top-links navbar-right">
                        <li>
                            <span class="m-r-sm text-muted welcome-message">欢迎使用道路养护管理系统</span>
                        </li>
                        <li>
                            <a href="../../login.html">
                                <i class="fa fa-sign-out"></i> 退出登录
                            </a>
                        </li>
                    </ul>
                </nav>
            </div>

    <!--主界面-->
    <div style="margin-top: 30px" class="layui-container" >
            
        <h1 style="text-align: center;margin-bottom: 30px">道路技术状况评估结果表</h1>
        <div id="myTable">
            <table id="demo" lay-filter="test"></table>
        </div>

        <div style="margin: 20px 20% ;; display: none" id="formDemo">
            <form id="employeeAdd" class="layui-form">
                <div class="layui-form-item">
                    <label>日期</label>
                    <input id="road_technical_evaluate_date" style="width: 300px" type="text" name="road_technical_evaluate_date" placeholder="日期" autocomplete=“off” class="layui-input">
                </div>
                <div class="layui-inline">
                    <label>道路名称</label>
                    <select id="road_basic_name" name="road_basic_name" lay-verify="required" lay-search="" autocomplete="off" >
                    </select>
                </div>
                <div class="layui-form-item">
                    <label>综合评价指数(PQI)</label>
                    <input type="text" style="width: 300px" name="road_technical_evaluate_PQI" lay-verify="required" lay-reqtext="综合评价指数(PQI)不能为空" placeholder="综合评价指数(PQI)" autocomplete="off" class="layui-input">
                </div>
                <div class="layui-form-item">
                    <label>PQI等级</label>
                    <input style="width: 300px" type="text" name="road_technical_evaluate_PQIindex"  lay-verify="required" lay-reqtext="PQI等级不能为空" placeholder="PQI等级" class="layui-input" autocomplete="off" >
                </div>
                <div class="layui-form-item">
                    <label>平整度RQI/IRI</label>
                    <input style="width: 300px" type="text" name="road_technical_evaluate_RQI_IRI"  lay-verify="required" lay-reqtext="平整度RQI/IRI不能为空" placeholder="平整度RQI/IRI" class="layui-input" autocomplete="off" >
                </div>
                <div class="layui-form-item">
                    <label>平整度RQI/IRI</label>
                    <input style="width: 300px" type="text" name="road_technical_evaluate_RQIindex"  lay-verify="required" lay-reqtext="平整度RQI/IRI不能为空" placeholder="平整度RQI/IRI" class="layui-input" autocomplete="off" >
                </div>
                <div class="layui-form-item">
                    <label>PCI</label>
                    <input style="width: 300px" type="text" name="road_technical_evaluate_PCI"  lay-verify="required" lay-reqtext="破损情况(PCI)不能为空" placeholder="破损情况(PCI)" class="layui-input" autocomplete="off" >
                </div>
                <div class="layui-form-item">
                    <label>破损情况等级</label>
                    <input style="width: 300px" type="text" name="road_technical_evaluate_PCIindex"  lay-verify="required" lay-reqtext="破损情况等级不能为空" placeholder="破损情况等级" class="layui-input" autocomplete="off" >
                </div>
                <div class="layui-inline">
                    <label>车行道编号</label>
                    <select id="roadway_id" name="roadway_id" lay-verify="required" lay-search="" autocomplete="off" >
                    </select>
                </div>
                    </div>
                </div>
            </form>
        </div>
                <div style="margin-left: 80px" class="layui-form-item">
                    <div>
                        <button class="layui-btn layui-btn-normal" lay-submit lay-filter="Add">添加</button>
                        <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                    </div>
                </div>
            </form>
        </div>

        <!--序列-->
        <script type="text/html" id="zizeng">
            {{d.LAY_TABLE_INDEX+1}}
        </script>

        <!--头部工具-->
        <script type="text/html" id="toolbarDemo">
            <div class="layui-btn-container">
                <button data-method="offset" data-type="auto"  class="layui-btn layui-btn-sm" lay-event="add">添加数据</button>
                <button class="layui-btn layui-btn-sm" lay-event="deleteAll">删除选中</button>
                <button class="layui-btn layui-btn-sm" lay-event="getCheckLength">获取选中数目</button>
                <button class="layui-btn layui-btn-sm" lay-event="isAll">验证是否全选</button>
                <button class="layui-btn layui-btn-sm" lay-event="Ch">改变列</button>
            </div>
        </script>

        <!--操作框-->
        <script type="text/html" id="barDemo">
            <a class="layui-btn layui-btn-xs" lay-event="detail">查看</a>
            <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
        </script>
    <script>
           layui.use(['element', 'jquery', 'table','layer','form','laydate'], function () {
          var $ = layui.jquery
           , table = layui.table
           , element = layui.element
           , jquery=layui.jquery
           , form=layui.form
           ,laydate=layui.laydate;
           laydate.render({
                    elem: '#road_technical_evaluate_date' //指定元素
                });
                var   title1 =
                     [ 
                     {type: 'checkbox', fixed: 'left'}
                            ,{field:'zizeng',title: '序列',fixed: 'left',templet:'#zizeng',align:'center'}
                            ,{field:'road_technical_evaluate_id',hide:true,title: '道路技术状况评估结果编号',align:'center'}
                            ,{field:'road_technical_evaluate_date',edit:true,title: '日期',align:'center'}
                            , { field: 'road_basic_id',edit:true,title: '道路编号',  totalRow: true ,align:'center'}
                            , { field: 'road_technical_evaluate_PQI',edit:true,title: '综合评价指数(PQI)',  totalRow: true ,align:'center'}
                            , { field: 'road_technical_evaluate_PQIindex',edit:true,title: 'PQI等级',  totalRow: true ,align:'center'}
                            ,{fixed: 'right', title:'操作', toolbar: '#barDemo',align:'center',width:160}
                     ]
                var title2=
                [
                         {type: 'checkbox', fixed: 'left'}
                       ,{field:'zizeng',title: '序列',fixed: 'left',templet:'#zizeng',align:'center'}
                       , { field: 'road_technical_evaluate_RQI/IRI',edit:true,title: '平整度RQI/IRI',  totalRow: true ,align:'center'}
                            , { field: 'road_technical_evaluate_PCI',edit:true,title: '破损情况(PCI)',  totalRow: true ,align:'center'}
                            , { field: 'road_technical_evaluate_PCIindex',edit:true,title: '破损情况等级',  totalRow: true ,align:'center'}
                            , { field: 'roadway_id',edit:true,title: '车行道编号',  totalRow: true ,align:'center'}
                       ,{fixed: 'right', title:'操作', toolbar: '#barDemo',align:'center',width:200}
                ]
                
        var tableIns = table.render({
             elem: '#demo'
             ,url:'http://localhost:8080/roadTechnicalEvaluate/findByPage'
             , id: 'demoTest'
            ,cellMinWidth: 80
            , page: true //开启分页
            ,defaultToolbar: ['filter', 'exports', 'print', { //自定义头部工具栏右侧图标。如无需自定义，去除该参数即可
                        title: '提示'
                        ,layEvent: 'LAYTABLE_TIPS'
                        ,icon: 'layui-icon-tips'
                    }]
             ,toolbar: '#toolbarDemo' //开启头部工具栏，并为其绑定左侧模板
             , cols: [title1]
        });
        var ii=1
  table.on('toolbar(test)', function(obj){
                    var checkStatus = table.checkStatus(obj.config.id);
                    switch(obj.event){
                        case 'add':
                            add();
                            break;
                        case 'getCheckLength':
                            var data = checkStatus.data;
                            layer.msg('选中了：'+ data.length + ' 个');
                            break;
                        case 'isAll':
                            layer.msg(checkStatus.isAll ? '全选': '未全选');
                            break;
                        case 'deleteAll':
                            layer.alert('待开放功能');
                            break;
                        case 'Ch' :
                           che();
                           break;
                        //自定义头工具栏右侧图标 - 提示
                        case 'LAYTABLE_TIPS':
                            layer.alert('待开放功能');
                            break;
                    };
                });

                //监听行工具事件
                table.on('tool(test)', function(obj){
                    var data = obj.data;
                    //console.log(obj)
                    if(obj.event === 'del'){
                        layer.confirm('你确定要删除此信息吗？', function(index){
                            $.ajax({
                                type: "POST",
                                url: "http://localhost:8080/roadTechnicalEvaluate/delete?id="+data.road_technical_evaluate_id,
                                success: function(data) {
                                    obj.del();
                                    layer.close(index);
                                }
                                // error:function (e) {
                                //     alert("请求失败"+e.toString())
                                // }
                            })
                        });
                    }else if(obj.event==="detail"){
                        layer.alert(JSON.stringify(data));
                    }else if(obj.event==="edit"){

                    }
                });

                //监听单元格编辑
                table.on('edit(test)', function(obj){
                    var value = obj.value //得到修改后的值
                        ,data = obj.data; //得到所在行所有键值
                    $.ajax({
                        type: "POST",
                        url: "http://localhost:8080/roadTechnicalEvaluate/change",
                        data:data,
                        success: function(success) {
                            layer.msg(' 字段更改为：'+ value);
                        }
                        // error:function (e) {
                        //     alert("请求失败"+e.toString())
                        // }
                    });
                });

                function che(){
                    if(ii==1)
            {
            var tableIns2 = table.render({
            elem: '#demo'
            ,url:'http://localhost:8080/roadTechnicalEvaluate/findByPage'
            , id: 'demoTest'
            ,cellMinWidth: 80
            , page: true //开启分页
            ,defaultToolbar: ['filter', 'exports', 'print', { //自定义头部工具栏右侧图标。如无需自定义，去除该参数即可
                        title: '提示'
                        ,layEvent: 'LAYTABLE_TIPS'
                        ,icon: 'layui-icon-tips'
                    }]
                    ,toolbar: '#toolbarDemo' //开启头部工具栏，并为其绑定左侧模板
             , cols: [title2]
             });
             ii=ii+1
            }
            else if(ii==2)
            {    
                var tableIns2 = table.render({
            elem: '#demo'
            ,url:'http://localhost:8080/roadTechnicalEvaluate/findByPage'
            , id: 'demoTest'
            ,cellMinWidth: 80
            , page: true //开启分页
            ,defaultToolbar: ['filter', 'exports', 'print', { //自定义头部工具栏右侧图标。如无需自定义，去除该参数即可
                        title: '提示'
                        ,layEvent: 'LAYTABLE_TIPS'
                        ,icon: 'layui-icon-tips'
                    }]
                    ,toolbar: '#toolbarDemo' //开启头部工具栏，并为其绑定左侧模板
             , cols: [title1]
             }); 
             ii=ii-1
            }
        }
                

                function add() {
                    layer.open({
                        type: 1
                        ,area:['500px','600px']
                        ,title:'信息添加'
                        ,offset: 'auto'//具体配置参考：http://www.layui.com/doc/modules/layer.html#offset
                        ,id: 'layerDemo' //防止重复弹出
                        ,scrollbar: false // 父页面 滚动条 禁止
                        ,content: $("#formDemo")
                        ,resize:false
                    });
                    //监听提交
                    form.on('submit(Add)', function(data){
                        $.ajax({
                            type: "POST",
                            url: "http://localhost:8080/roadTechnicalEvaluate/add",
                            data: $('#employeeAdd').serialize(),
                            success: function(result) {

                            }
                        });
                    });
                };
            })
        </script>

    </div>

</div>

</div>
</body>
</html>




